<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            font-family: SimHei;
        }

        @page {
            @bottom-center {
                content: counter(page);
                font-family: SimHei;
                font-size: 16px;
                color: #FF0000;
            };
            size: A4;
        }

        th, td {
            font-size: 12px;
            height: 108px;
            text-align: center;
            word-wrap: break-word;
            word-break: break-all;
        }

        .ttd {
            width: 250px;
            height: 84px;
            font-size: 12px;
        }

        .logo_box img {
            width: 100%;
            height: 100%;
        }


        .page {
            height: 100%;
            width: 100%;
        }

        /*头部共用*/
        .share {
            width: 100%;
        }

        .share img {
            width: 100%;
        }


        .top2table {
            width: 100%;
            height: 30px;
            margin: 0px auto;
            font-size: 16px;
            color: #444444;
            border-collapse: collapse;
        }
    </style>
</head>
<body style="width: 695px;">
<div class="page">
    <div class="share">
        <img src="https://oies.oss-cn-shanghai.aliyuncs.com/OTO/oto_logo.png" alt=""/>
        <div style="text-align: center;margin: 10px auto;">学员<span>${childName}</span><span>${monthTime}</span>训练报告
        </div>

        <table border="1" class="top2table">
            <tr style="height: 60px;">
                <td style="padding-left: 15px;">姓名：<span>${childName}</span></td>
                <td style="padding-left: 15px;">生理年龄：${childAge}</td>
                <td style="padding-left: 15px;">使用时间：<span>${scheduleTime}</span></td>
            </tr>
        </table>

    </div>
    <table border="1" style="border-collapse: collapse;width: 100%;margin: 20px auto 0;text-align: center;">
        <tr>
            <th style="width: 180px;">课程分类</th>
            <th style="width: 50px;" colspan="2">训练目标</th>
            <th style="width: 200px;">训练项目</th>
            <th style="width: 100px;">达成情况</th>
        </tr>
        <tr>
            <td rowspan="3" class="ttd">
                <p>感知觉与运动</p>
                <p id="teacher1">责任老师：${teacherName1}</p>
            </td>
            <td colspan="2" class="ttd">感觉与知觉</td>
            <td class="ttd">${program1}</td>
            <td>${rateStr1}</td>
        </tr>
        <tr>
            <td colspan="2" class="ttd">大运动技能</td>
            <td class="ttd">${program2}</td>
            <td>${rateStr2}</td>
        </tr>
        <tr>
            <td colspan="2" class="ttd">精细动作</td>
            <td class="ttd">${program3}</td>
            <td>${rateStr3}</td>
        </tr>
        <tr>
            <td rowspan="4">
                <p>言语与语言</p>
                <p>责任老师：${teacherName2}</p>
            </td>
            <td colspan="2">言语功能</td>
            <td class="ttd">${program6}</td>
            <td>${rateStr6}</td>
        </tr>
        <tr>
            <td rowspan="2" style="width: 65px;">语言表达</td>
            <td>语言</td>
            <td class="ttd">${program7}</td>
            <td rowspan="2">${rateStr7}</td>
        </tr>
        <tr>
            <td>句式</td>
            <td class="ttd">${program8}</td>

        </tr>
        <tr>
            <td colspan="2">社交互动</td>
            <td class="ttd">${program9}</td>
            <td>${rateStr8}</td>
        </tr>
        <tr>
            <td rowspan="2">
                <p>认知</p>
                <p>责任老师：${teacherName3}</p>
            </td>
            <td colspan="2">基础认知</td>
            <td class="ttd">${program4}</td>
            <td>${rateStr4}</td>
        </tr>
        <tr>
            <td colspan="2">认知能力</td>
            <td class="ttd">${program5}</td>
            <td>${rateStr5}</td>
        </tr>
    </table>


</div>
</body>
</html>